<template>
  <div class="loading-box">
	<!-- width:宽度，height:高度，animationData：加载的json文件 -->
	  <Vue3Lottie width="200px" height="200px" :animationData="loading01" />
  </div>
</template>

<script setup>
// 详细介绍https://www.npmjs.com/package/vue3-lottie
import {Vue3Lottie} from "vue3-lottie";
import loading01 from "@/assets/json/loading01.json"

</script>

<style scoped lang="scss">
.loading-box {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(0 0 0 / 20%);

  position: absolute;
  top: 0;
  left: 0;
  :deep(.ant-spin-dot-item) {
    background-color: #fff;
  }
  :deep(.ant-spin.ant-spin-show-text .ant-spin-text) {
    color: #fff;
  }
}
</style>
